<template>
  <div style="height: 720px; background-color: white">
    <el-form
      label-position="left"
      label-width="80px"
      :model="goods"
      ref="goods"
      style="margin-top:100px;margin-left:100px;"
    >
      <el-form-item label="商品名称" prop="name">
        <el-input v-model="goods.name" style="width:300px;"></el-input>
      </el-form-item>
      <el-form-item label="商品价格" prop="price">
        <el-input v-model="goods.price" style="width:300px;"></el-input>
      </el-form-item>
      <el-form-item label="商品库存" prop="nums">
        <el-input v-model="goods.nums" style="width:300px;"></el-input>
      </el-form-item>
      <el-form-item label="商品类型" prop="type">
        <el-input v-model="goods.type" style="width:300px;"></el-input>
      </el-form-item>
      <el-form-item label="商品型号" prop="model">
        <el-input v-model="goods.model" style="width:300px;"></el-input>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="submitForm">立即创建</el-button>
        <el-button @click="resetForm('goods')">重置</el-button>
      </el-form-item>
    </el-form>
    <el-tag type="danger" style="margin-left:100px;">注意图片的名字一定要和商品的名字一样，否则可能无法显示</el-tag><br>

    <input type="file" name="imgfile" ref="imgfile" style="margin-left:100px;"/>
    <button @click="upload">提交</button>
  </div>
</template>
<script>
export default {
  data(){
    return{
      goods:{
        name:'',
        price:0,
        nums:0,
        type:'',
        model:''
      }
    }
     
  },
  methods: {
    submitForm(){
      if(this.goods.name=="" || this.goods.price==0 || this.goods.nums==0 || this.goods.type==""){
        alert("请填写完整的信息");
      }else if(this.$store.state.marketName == ""){
        alert("您还没有开店");
      }
      else{
      let goodsInfo = {
        goods_name:this.goods.name,
        goods_price:this.goods.price,
        goods_nums:this.goods.nums,
        goods_type:this.goods.type,
        marketname:this.$store.state.marketName,
        goods_model:this.goods.model
      };
      this.axios.post("/api/shopping/addGoods.php",goodsInfo).then(res=>{
        console.log(res.data);
        alert(res.data);
      });
      }
    },
    resetForm(formName){
      this.$refs[formName].resetFields();
    },
    upload(){
      let formdata = new FormData();
      formdata.append("imgfile",this.$refs.imgfile.files[0]);
      if(this.$refs.imgfile.files[0].size/1024/1024 > 8){
        alert("图片不能超过8m");
      }else{
        this.axios.post("/api/shopping/imageLoad.php",formdata).then(res=>{
          // if(res.data=="ok"){
          //   alert("上传成功");
          // }else{
          //   alert("上传错误");
          // }
          if(res.data!=""){
            this.$message({
              message:"上传成功",
              type:"success"
            });
          }else{
            this.$message({
              message:'服务器繁忙',
              type:"success"
            });
          }
        });
      }
    }
  },
};
</script>